<!DOCTYPE html>
<html lang="en">

<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- <link href="css/style.css" rel="stylesheet"> -->
    <script src="./jquery-3.2.1.min.js"></script>
</head>
<style type="text/css">
    .big {
        width: 600px;
        height: 100px;
        border: solid 2px;
    }

    .bottom {
        width: 600px;
        height: 50px;
        border: solid 2px red;
    }

    .add {
        width: 600px;
        height: 300px;
        border: solid 2px blue;
    }
</style>

<body>



    <div id="content">
        <div id="scroll">aaa</div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
        <div class="big">
            这是一个测试DIV
        </div>
    </div>
    <div id="bottom" class="bottom">这是底部</div>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
        $(function () {
            run_interval = setInterval(function () {
                var offHeight = $("#bottom").offset().top,
                    windowHeight = $(window).height(),
                    scrollHeight = $(document).scrollTop(),
                    html = '<div class="add"> 这是一个后来加de测试DIV</div>';
                var sumHeight = scrollHeight + windowHeight + 30;
                if (sumHeight > offHeight) {
                    $("#content").append(html);
                }
            }, 1000);
        });
    </script>
</body>

</html>